<template>
	<view>
		<view class="bac-white content-row">
			<view class="item-box">
				<view class="text-view">始发地</view>
				<view class="city-text-name" v-if="startName!='null'">{{startName}}</view>
			</view>
			<view class="item-box">
				<view class="content-row">
					<image class="single_Arrow_image_class" src="@/static/single_Arrow.png" mode="widthFix"></image>
				</view>
				<view v-if="priceObject[0]" class="time-text">预计{{priceObject[0].days}}天到达</view>
			</view>
			<view class="item-box">
				<view class="text-view">目的地</view>
				<view class="city-text-name" v-if="endName!='null'">{{endName}}</view>
			</view>
		</view>
		<view v-if="priceObject[0]">
			<view v-for="(item,index) in priceObject" :key="index">
				<view class="wuliu-cankao-price-box">
					<view>
						<view class="wuliu-cankao-price-box-price">参考价：{{item.price}}元
						</view>
						<view class="store-wuliu-cankao-price-box" @click="storeClick()">
							<view class="wuliu-cankao-price-box-store">{{item.company_name}}</view>
							<image class="wuliu-cankao-price-box-image" src="@/static/right_back.png"></image>
						</view>

					</view>
					<view class="wuliu-cankao-price-box-phone" @click="phoneClick(item)">电话咨询</view>
				</view>
			</view>
		</view>

		<view v-else class="NO-DATA-view-box-class">
			<image class="NO-DATA-image-view-class" src="@/static/NoDataBac.png"></image>
			<view class="NO-DATA-text-chushou-class">暂无物流报价</view>
		</view>
	</view>
</template>

<script>
	import {
		logisticsFreight,
		logisticsCompanyDetails
	} from "@/api/logistics.js"
	export default {
		data() {
			return {
				startName: '上海',
				endName: '杭州',
				priceObject: [],
				company_id: ''

			}
		},
		onLoad(option) {
			var that = this
			if (option.startName)
				this.startName = option.startName
			if (option.endName)
				this.endName = option.endName
			const value = uni.getStorageSync('login')
			logisticsFreight(value.id, option.startId, option.endId).then(res => {
				that.priceObject = res.data
				that.$forceUpdate()
			})
		},
		methods: {
			//直接拨打电话
			phoneClick(item) {
				var that = this
				logisticsCompanyDetails(item.company_id).then(res => {
					that.$utils.log("打印获取到的物流公司的详细信息  " + JSON.stringify(res))
					// #ifdef MP-WEIXIN
					wx.makePhoneCall({
						phoneNumber: res.data.mobile, 
						success: function() {
							console.log("拨打电话成功！")
						},
						fail: function() {
							console.log("拨打电话失败！")
						}
					})
					// #endif
				})
			},
			storeClick() {
				uni.navigateTo({
					url: '/pages/home/logistics/askpriceStoreMsg/askpriceStoreMsg?id=' + this.company_id
				})
			}
		}
	}
</script>

<style>
	page {
		background: #F5F5F5;
		opacity: 1;
	}

	.content-row {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.bac-white {
		width: 100%;
		height: auto;
		background: white;

	}

	.item-box {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.text-view {
		font-size: 24rpx;
		font-family: Alibaba PuHuiTi;
		font-weight: 400;
		color: #666666;
		opacity: 1;
		margin-top: 40rpx;
	}

	.city-text-name {
		font-family: Alibaba PuHuiTi;
		font-weight: 500;
		color: #333333;
		opacity: 1;
		margin-top: 8rpx;
		margin-bottom: 48rpx;
	}

	.time-text {
		font-size: 22rpx;
		font-family: Alibaba PuHuiTi;
		font-weight: 400;
		color: #0E59EA;
		opacity: 1;
	}

	.line {
		width: 18rpx;
		height: 2rpx;
		border: 1px solid #CACACA;
		opacity: 1;
		border-radius: 4rpx;
		background-color: #CACACA;
	}

	.single_Arrow_image_class {
		width: 60rpx;
		height: 15rpx;
		height: auto;
		opacity: 0.21;
	}

	.wuliu-cankao-price-box {
		width: 650rpx;
		background: #FFFFFF;
		opacity: 1;
		border-radius: 0rpx;
		margin: auto;
		margin-top: 12rpx;

		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-direction: row;

		padding: 34rpx 10rpx 46rpx 28rpx;
	}

	.wuliu-cankao-price-box-image {
		width: 15.01rpx;
		height: 26.92rpx;
		margin-left: 6rpx;
	}

	.wuliu-cankao-price-box-phone {
		width: 178rpx;
		height: 58rpx;
		background: #EDF1FF;
		border-radius: 30rpx;
		font-size: 24rpx;
		font-family: Alibaba PuHuiTi;
		font-weight: 500;
		line-height: 58rpx;
		color: #0E59EA;
		opacity: 1;
		text-align: center;

	}

	.wuliu-cankao-price-box-price {
		font-size: 30rpx;
		font-family: Alibaba PuHuiTi;
		font-weight: 500;
		color: #0E59EA;
		opacity: 1;
	}

	.wuliu-cankao-price-box-store {
		font-size: 28rpx;
		font-family: Alibaba PuHuiTi;
		font-weight: 400;
		color: #666666;
		opacity: 1;
	}

	.store-wuliu-cankao-price-box {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.NO-DATA-view-box-class {
		width: 100%;
		height: 100%;
		text-align: center;
	}

	.NO-DATA-image-view-class {
		width: 380rpx;
		height: 380rpx;
		margin: auto;
		margin-top: 208rpx;
	}

	.NO-DATA-text-chushou-class {
		font-size: 24rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #1C2125;
		opacity: 1;
	}
</style>